<!DOCTYPE html>
<html lang="zh">
<head>
  <meta charset="UTF-8">
  <title>详情</title>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
  <link rel="stylesheet" href="css/weui.css"/>
  <link rel="stylesheet" href="css/weui2.css"/>
  <script src="js/zepto.min.js"></script>
  <script src="js/swipe.js"></script>

  <link rel="stylesheet" href="css/detail.css">
</head>
<body ontouchstart>
  <header class="header">
    <div class="slide" id="slideshow">
      <ul>
        <li><a href="#"><img src="images/d-1.jpg" alt=""></a></li>
        <li><a href="#"><img src="images/d-2.jpg" alt=""></a></li>
        <li><a href="#"><img src="images/d-3.jpg" alt=""></a></li>
      </ul>
      <div class="dot"><span></span><span></span><span></span></div>
    </div>
    <div class="arrti">

      <div class="info">
        <div class="title">
          <strong class="name">大蒸馍 —— 无添加剂-绿色</strong>
          <div class="attach">
            <em class="sales">月售112个</em>
            <em class="feedback-rate">好评率97%</em>
          </div>
        </div>
        <div class="detail">
          <span class="icon icon-93"></span>
          <span class="d-txt">详情</span>
        </div>
      </div>

      <div class="operate">
        <span class="picon">￥</span><span class="sell">0.5</span>
        <span class="price">￥0.5</span>
        <div class="num">
          <span class="subtract">-</span>
          <span class="count">1</span>
          <span class="add icon icon-78"></span>
        </div>
      </div>
    </div>
  </header>

  <article class="weui_cells comment">
    <h1 class="title">商品评价</h1>
    <div class="total">
      <span class="comm">好评度<em class="f-red">100%</em></span>
      <span class="count-comm">2人评价</span>
    </div>
    <div class="weui_cell">
      <div class="buyer">
        <div class="avatar"><img src="images/tx.jpg"></div>
        <span class="phone">186****6683</span>
        <span class="level level-0">level</span>
        <em class="date">2016.6.8 11:28</em>
      </div>
      <div class="comm">
        <div class="comm-buyer">
          好评，比想象中的好吃！
        </div>
      </div>
    </div>
    <div class="weui_cell">
      <div class="buyer">
        <div class="avatar"><img src="images/tx.jpg"></div>
        <span class="phone">186****6683</span>
        <span class="level level-0">level</span>
        <em class="date">2016.6.8 11:28</em>
      </div>
      <div class="comm">
        <div class="comm-buyer">
          好评，比想象中的好吃！
        </div>
        <div class="comm-reply">
          <span>回复：</span><span class="main">谢谢支持！</span>
        </div>
      </div>
    </div>
    <div id="more" class="more">查看全部评论</div>
  </article>

  <footer class="footer">
    <div class="main">
      <div class="sell">5.50<span>元</span></div>
      <div class="desc">
        <div class="note">
          <span class="count">12个</span>
          <!--<span class="state">（满5元送一个）</span>-->
        </div>
        <!--<em class="leaflet">满5元免运费,支持货到付款</em>-->
        <em class="leaflet">满5元送一个</em>
      </div>
      <div class="btn">
        <div class="collect">
          <span class="icon icon-74"></span>
          <span class="c-txt">收藏</span>
        </div>
        <div class="add">加入购物车</div>
      </div>
    </div>
  </footer>
  <script>
    $(function () {
      $('#slideshow').swipeSlide({
        autoSwipe: true,//自动切换默认是
        speed: 3000,//速度默认4000
        continuousScroll: true,//默认否
        transitionType: 'cubic-bezier(0.22, 0.69, 0.72, 0.88)',//过渡动画linear/ease/ease-in/ease-out/ease-in-out/cubic-bezier
        lazyLoad: true,//懒加载默认否
        firstCallback: function (i, sum, me) {
          me.find('.dot').children().first().addClass('cur');
        },
        callback: function (i, sum, me) {
          me.find('.dot').children().eq(i).addClass('cur').siblings().removeClass('cur');
        }
      });
    });
  </script>
  <script src="js/example.js"></script>
</body>
</html>